<template>
  <p>App</p>
  <!-- 
    v-model="xxx"
      1. 绑定 modelValue 属性
      2. 绑定 update:modelValue 事件
   -->
  <Child v-model="count" />
  <!-- 
    v-model:xxx="xxx"
      1. 绑定 xxx 属性
      2. 绑定 update:xxx 事件

      结论:
        1. 如果只有一个数据需要双向绑定，用v-model
        2. 如果有多个数据需要双向绑定，用v-model:xxx
   -->
  <Son v-model:count="count" v-model:number="count" />
</template>

<script lang="ts">
import Child from "./Child.vue";
import Son from "./Son.vue";

export default {
  name: "App",
  data() {
    return {
      count: 0,
    };
  },
  components: {
    Child,
    Son,
  },
};
</script>
